<%--
  Created by IntelliJ IDEA.
  User: yangkunhong
  Date: 2024/6/27
  Time: 18:10
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--
  Created by IntelliJ IDEA.
  User: A415
  Date: 2024/6/20
  Time: 8:38
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!--111111111111-->
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>个人中心</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="//unpkg.com/layui@2.9.13/dist/css/layui.css" rel="stylesheet">
    <!---22222222222----->
    <script src="//unpkg.com/layui@2.9.13/dist/layui.js"></script>
    <style>
        .layui-layout-admin .layui-header {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            background-color: #bb13a6;/*顶部背景色*/
        }
        .layui-bg-black {
            background-color: #e111a1 !important;/*侧边背景色*/
            color: #fff !important;
        }
        .layui-nav {
            position: relative;
            padding: 0 15px;
            background-color: #e111a1;/*侧边一级导航背景色*/
            color: #fff;
            border-radius: 2px;
            font-size: 0;
            box-sizing: border-box;
        }
        .layui-nav-tree .layui-nav-child {
            position: relative;
            z-index: 0;
            top: 0;
            border: none;
            background: 0 0;
            background-color: rgba(0, 0, 0, .3);/*侧边二级导航背景色*/
            box-shadow: none;
        }
        body{

        }
    </style>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/frontend/css/common.css"/>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/frontend/css/style.css"/>

</head>
<body>
<style>
    .nav-wrap>li, .nav-item {
        float: left;
        line-height: 68px;
        width: 128px;
        text-align: center;
        color: #533336;
        font-size: 18px;
    }
    .layui-card-body{
        width: 600px;
        margin: 0 auto;
    }
</style>
<div class="clearfix nav">
    <a class="logo" href="javascript:;"></a>
    <ul class="clearfix nav-wrap">
        <li><a class="nav-item nav-active" href="${pageContext.request.contextPath}/IndexServlet001">首页</a></li>
        <li><a class="nav-item" href="${pageContext.request.contextPath}/IndexServlet001">品牌故事</a></li>
        <li><a class="nav-item" href="${pageContext.request.contextPath}/GoodsServlet136/list">美食系列</a></li>
        <li><a class="nav-item" href="${pageContext.request.contextPath}/IndexServlet001">店面展示</a></li>
        <li><a class="nav-item" href="${pageContext.request.contextPath}/IndexServlet001">新闻资讯</a></li>
        <li><a class="nav-item" href="${pageContext.request.contextPath}/IndexServlet001">关于我们</a></li>
        <!--
        -->
        <c:if test="${not empty sessionScope.get('USER_INFO')}">
            <!-- 你的代码，当"yourAttributeName"存在时 -->
            <li><a class="nav-item" href="${pageContext.request.contextPath}/UserServlet136/center">${sessionScope.get("USER_INFO").getUsername()}</a></li>
        </c:if>
        <c:if test="${empty sessionScope.get('USER_INFO')}">
            <!-- 你的代码，当"yourAttributeName"存在时 -->
            <li><a class="nav-item" href="${pageContext.request.contextPath}/UserServlet136/reg">注册</a></li>
            <li><a class="nav-item" href="${pageContext.request.contextPath}/UserServlet136/login">登陆</a></li>
        </c:if>
    </ul>

</div>
<div class="layui-card-body">
    <form class="layui-form" action="">
        <div class="layui-form-item">
            <label class="layui-form-label">旧密码</label>
            <div class="layui-input-block">
                <input type="text" name="oldPassword" lay-verify="required" placeholder="请输入旧密码" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">新密码</label>
            <div class="layui-input-block">
                <input type="password" name="newPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">确认密码</label>
            <div class="layui-input-block">
                <input type="password" name="rePassword" lay-verify="required" placeholder="请再次输入密码" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="submit" class="layui-btn" lay-submit lay-filter="demo1">确认修改</button>
            </div>
        </div>
    </form>
</div>
<script src="${pageContext.request.contextPath}/frontend/layui/axios.min.js"></script>
<script>
    //js javascript
    layui.use(['form', 'laydate', 'util'], function(){
        var form = layui.form;
        var layer = layui.layer;
        var laydate = layui.laydate;
        var util = layui.util;
        // 绑定事件
        //
        form.on('submit(demo1)', function(data){
            console.log(data.field); // 打印表单的字段
            // 执行相关的提交操作
            if(data.field.oldPassword == ""){
                layer.alert("请输入旧密码");
                return false;
            }
            if(data.field.newPassword == ""){
                layer.alert("请输入新密码");
                return false;
            }
            if(data.field.rePassword == ""){
                layer.alert("请再次输入新密码");
                return false;
            }

            if(!(data.field.newPassword == data.field.rePassword) ){
                layer.alert("两次密码不一致");
                return false;
            }
            //数据校验通过之后，post提交到服务端
            axios.post(
                '${pageContext.request.contextPath}/UserServlet136/password',
                data.field
            )
                .then(function (response) {
                    // 请求成功时处理响应数据
                    //根据服务端返回的数据做处理

                    if(response.data.code == 200){
                        layer.alert(response.data.message,function (){
                            //刷新当前页面
                            window.location.href="${pageContext.request.contextPath}/IndexServlet001";
                        })
                    }else{
                        layer.alert(response.data.message)
                    }


                    console.log(response.data);
                })
                .catch(function (error) {
                    // 请求失败时处理错误
                    console.error(error);
                });
            return false; // 阻止表单默认提交行为
        });

    });

</script>
</body>
</html>


